<template>
  <div>
    <tab :line-width=2 active-color='#0076e4' v-model="select01">
      <tab-item :selected="select01 === index" v-for="(item, index) in list2" @on-item-click="initData(count,select01)"
                :key="index">{{item}}
      </tab-item>
    </tab>
    <!--<swiper v-model="select01" :show-dots="false">-->
    <!--<swiper-item v-for="(item, index) in list2" :key="index">-->
    <!--<group>-->
    <!--<cell :title="caseItem.caseName" :inline-desc="caseItem.time" :link="caseItem.url"-->
    <!--v-for="(caseItem, index) in caseObj" :key="index"></cell>-->
    <!--</group>-->
    <!--</swiper-item>-->
    <!--</swiper>-->
    <group>
      <cell :title="caseItem.caseName" :link="caseItem.url" :inline-desc="caseItem.time"
            v-for="(caseItem, index) in caseObj" :key="index"></cell>
    </group>
    <div class="btn-box" v-show="isShow">
      <p class="loadingMore" @click="loadMore()" v-if="count<totalRow">加载更多</p>
      <p class="loadingMore" v-else>已加载全部</p>
    </div>
  </div>
</template>
<script type="text/ecmascript-6">
  import {Tab, TabItem, Swiper, SwiperItem, Group, Cell} from 'vux'
  // const list = () => ['全部', '已处理', '未处理'];
  const list = () => ['全部', '已回复', '未回复'];
  export default {
    data(){
      return {
        list2: list(),
        select01: 0,
        count: 4,
        totalRow: '',
        userguid: JSON.parse(localStorage.getItem('user')).guid,
        caseObj: [
//          {
//            caseName: '无数据',
//            time: '无数据',
//            url: ''
//          }
        ],
        isShow: false,
      }
    },
    created(){
      this.initData(this.count, this.select01);
    },
    methods: {
      initData(val, sel){
        let _self = this;

        this.axios.get(global.baseApiUrl + '/apphub/report/page', {
//        this.axios.get('http://172.17.118.48:9011/apphub/report/page', {
          params: {
            ps: val,
            pi: '1',
//            sb: 'createdate',
//            sd: 'desc',
            q_userguid_s_eq: _self.userguid,
            q_crstatus_s_eq: _self.select01 === 0 ? "" : _self.select01 === 1 ? "Y" : "N"
          }
        })
          .then(function (response) {
            _self.caseObj = [];
            //console.log(response.data);
            let d = response.data.data.list;
            for (let i = 0; i < d.length; i++) {
              _self.$set(_self.caseObj, i, {
                caseName: d[i].CRCONTENT,
                time: d[i].CREATEDATESTR,
                url: '/user/report/detail/' + d[i].GUID
              });
            }
            _self.totalRow = response.data.data.totalRow;
            _self.isShow = true;
          })
          .catch(function (response) {
            console.log(response);
          });
      },
      loadMore () {
        this.count += 4;
        this.initData(this.count);
      }
    },
    components: {
      Cell,
      Group,
      Tab,
      TabItem,
      Swiper,
      SwiperItem
    }
  }
</script>
<style rel="stylesheet/less" lang="less" scoped>
  .weui-cells__title {
    padding-top: 8px;
    padding-bottom: 8px;
    margin-top: 0;
    margin-bottom: 0;
    background-color: #f5f5f5;
  }
</style>
